import React from 'react';
import { Button, Container, ListGroup, ListGroupItem } from 'react-bootstrap';
import { useNavigate } from 'react-router';

interface MaterialProps{}
interface MaterialState{}

const Material:React.FC = (props:MaterialProps,state:MaterialState)=>{
    
    const navigate = useNavigate();

    const addTmpMaterial = ()=> {
        navigate(`/material/edit?type=tmp`)
    };

    const addPerMaterial = ()=> {
        navigate(`/material/edit?type=per`)
    };

    const gotoMaterialSummary = ()=> {
        navigate("/material/summary?type=summary")
    }
    
    const gotoMaterialList = ()=> {
        navigate("/material/list");
    }

    return (<Container>
        <ListGroup>
            <ListGroupItem><Button onClick={gotoMaterialList}>素材列表</Button></ListGroupItem>
            {/* <ListGroupItem><Button onClick={addTmpMaterial}>添加临时素材</Button></ListGroupItem> */}
            <ListGroupItem><Button onClick={addPerMaterial}>添加永久素材</Button></ListGroupItem>
            {/* <ListGroupItem><Button onClick={gotoMaterialSummary}>汇总</Button></ListGroupItem> */}
        </ListGroup>
    </Container>)
}

export default Material;